<template>
	<view class="contain" :style="{ 'padding-top': top + 'px' }">
		
		
			<view class="flex f-s-0 h-44   box-c" :style="{ 'padding-top': top + 'px' }">
					<view @click="back(1)" class="flex padding-lr10 f-a-c van-icon van-icon-arrow-left f20-size"></view>
					<view class="flex f-a-c flex-1">
							
							<getlocation   :type="0" color="#000000"></getlocation>
					</view>
					<view class="flex f-a-c flex-2">
						<view class="flex flex-1 h-32  b-radius-30 bg-color-f9 padding-lr4">
							<text class="flex f-a-c f-s-0 van-icon van-icon-search padding-lr2 f18-size t-color-0 margin-r6"></text>
							<view class="flex flex-1 h100">
								<input @confirm="search" v-model="value" type="text" value="" class="input f12-size" :placeholder="i18n['搜索']" />
							</view>
							<view class="flex f-a-c h100">
								<view @click="search()" class="flex f-a-c f-j-c f-s-0 w-50 b-radius-30 h-26 bg-color-linear-y t-color-w f12-size">{{i18n['搜索']}}</view>
							</view>
						</view>
					</view>
					<view class="flex f-s-0 f-a-c f-j-c padding-lr6 f20-size"></view>
					<xcx-header></xcx-header>
			</view>
				
				
	<view class="flex-col page">
	  <view class="flex-col flex-auto group">
	    <view class="flex-col group_2 space-y-16">
	
		  

	
	      <view class="flex-col space-y-4">

	        <view    @click="go('/pages/other/salvation/detail?id='+item.id)" class="flex-row items-center list-item space-x-12" v-for="(item, index) in list" :key="index">
	          <image
	            class="shrink-0 image_6"
	            :src="item.cover" mode="widthFix"
	          /> 
	          <view class="flex-col items-start flex-auto">
	            <text class="font_3 text_5">{{item.title}}</text>
	          <!--  <text class="font_4 text_6"  @tap.stop="makePhone(item.mobile)">电话：{{item.mobile}}</text>
	            <text class="font_4"  @tap.stop="showMaoLocation(1,1,1,item.address)">地址：{{item.address}}</text> -->
				<text class="font_4 text_6">电话：{{item.mobile | hidephone}}</text>
				<text class="font_4" >地址：{{item.address}}</text>
	          </view>
	        </view>
			<no-data v-if="list.length <= 0"></no-data>
	      </view>
	    </view>
		
		
		
	 
	  </view>
	</view>
	
	<div @click="go('/pages/other/salvation/add')"
	style="word-wrap: break-word;font-size:30rpx;width:120rpx;height:120rpx;padding:20rpx;text-align:center;position: fixed;bottom:200rpx;right:50rpx;background:#ffc300 ;color:#fff;border-radius: 50%;">
		发布救助
	</div>
	
	
	
	</view>
</template>


<script>


const $ = require('@/utils/api.js');
const API = require('@/utils/api/common.js').default;
import loadMore from '@/components/load-more/load-more.vue';
import moment from '@/utils/moment';
export default {
	name: 'Integral',
	components: {
		loadMore
	},
	computed: {
		i18n() {
			return this.$t('search')
		},
	},
	// filters: {
	// 	hidephone: function(value) {
			 
	// 		var tel = value.toString();
	// 		tel = "" + tel;
	// 		var tel1 = tel.substr(0,3) + "****" + tel.substr(8)
	// 		console.log(tel1);
	// 		return tel1;
	// 	}
	// },
	
	data() {
		return {
	
			top: uni.getStorageSync('bartop') ? uni.getStorageSync('bartop') : 0,
			isIphonex: uni.getStorageSync('isIphonex') ? uni.getStorageSync('isIphonex') : false,
			isLogin: uni.getStorageSync('token') ? true : false,
			navList: [{ name: '分值明细' }, { name: '分值提升' }],
			current: 0,
			list: [],
			loadingType: 'more',
			page: 1,
			userInfo: {},
			loading: true,
			value: '',
		};
	},
	onLoad() {
		this.initData();
	},
	filters: {
		time(val) {
			return moment(val * 1000).format('YYYY-MM-DD HH:mm:ss');
		},
		numFilter(val) {
			return val >= 0 ? `+${val.toString()}` : val;
		}
	},
	// 加载更多
	onReachBottom() {
		
		console.log("11111111111111")
		console.log(this.loadingType)
  if (this.loadingType === 'nomore') return;
		this.page++;
		this.getList();
	},
	
	// 下拉刷新
	onPullDownRefresh() {
		this.page = 1;
		this.list = [];
		this.getList('refresh');
	},
	methods: {

		toCategory() {
			this.$mRouter.reLaunch({ route: '/pages/category/category' });
		},
		nav(index) {
			this.loading = true;
			this.current = index;
			this.page = 1;
			this.list.length = 0;
			this.getList( 'refresh');
		},
		initData() {

			this.userInfo = uni.getStorageSync('userInfo') || undefined;
			this.getList();
		},
		async getList(type) {
			await this.$http
				.get(`${API.assistList}`, {
					type: 1,
					page: this.page,
					keyword: this.value
				})
				.then(r => {
							console.log(r.data);
					this.loading = false;
					this.loadingType = r.data.length === 10 ? 'more' : 'nomore';
					this.list = [...this.list, ...r.data.list];
					if (type === 'refresh') {
						uni.stopPullDownRefresh();
					}
				})
				.catch(() => {
					this.loading = false;
					if (type === 'refresh') {
						uni.stopPullDownRefresh();
					}
				});
		},
		search() {
			if(this.value == ''){
				$.$toast(this.i18n['请输入搜索内容']);
				return;
			}
			this.loading = true;
			// this.current = index;
			this.page = 1;
			this.list = [];
			this.getList();
		},
	}
};
</script>


<style scoped>
	

	page {
	background: linear-gradient(180deg, #ffc300 6.5%, #ffffff 90.8%) repeat-y;
	/* background-repeat:repeat-y; */
	  width: 100%;
	  /* height: 100vh; */
	  padding-top:60rpx
	}
	.group {
	  overflow-y: auto;
	}
	.group_2 {
	  padding: 0 20rpx 24rpx 26rpx;
	}
	.space-y-16 > view:not(:first-child),
	.space-y-16 > text:not(:first-child),
	.space-y-16 > image:not(:first-child) {
	  margin-top: 32rpx;
	}
	.group_3 {
	  padding-left: 12rpx;
	}
	.image_4 {
	  width: 38rpx;
	  height: 38rpx;
	}
	.font_1 {
	  font-size: 24rpx;
	  font-family: HarmonyOSSansSC;
	  line-height: 22rpx;
	}
	.text_2 {
	  margin-left: 16rpx;
	  color: #081329;
	}
	.section {
	  margin-left: 44rpx;
	  padding-left: 16rpx;
	  background-color: #ffffff;
	  border-radius: 342rpx;
	  height: 62rpx;
	  border: solid 2rpx #ffbd52;
	}
	.image_5 {
	  width: 32rpx;
	  height: 30rpx;
	}
	.font_2 {
	  font-size: 20rpx;
	  font-family: HarmonyOSSansSC;
	  line-height: 18rpx;
	  color: #666e7a;
	}
	.text_3 {
	  color: #6d6a6b;
	  line-height: 19rpx;
	}
	.text-wrapper {
	  padding: 20rpx 0;
	  background-color: #ffbd52;
	  border-radius: 194rpx;
	  width: 108rpx;
	  height: 60rpx;
	}
	.text_4 {
	  color: #ffffff;
	}
	.list-item {
	  margin-right: 4rpx;
	  padding: 24rpx 16rpx;
	  background-color: #ffffff;
	  border-radius: 20rpx;
	  filter: drop-shadow(0px 0px 8rpx #ffbd5208);
	  overflow: hidden;
	}
	.image_6 {
	  border-radius: 8rpx;
	  width: 188rpx;
	  height: 140rpx;
	}
	.font_3 {
	  font-size: 32rpx;
	  font-family: HarmonyOSSansSC;
	  line-height: 30rpx;
	  color: #081329;
	}
	.text_5 {
	  line-height: 31rpx;
	}
	.font_4 {
	  font-size: 24rpx;
	  font-family: HarmonyOSSansSC;
	  line-height: 34rpx;
	  color: #666e7a;
	}
	.text_6 {
	  margin-top: 20rpx;
	}
	.space-x-12 > view:not(:first-child),
	.space-x-12 > text:not(:first-child),
	.space-x-12 > image:not(:first-child) {
	  margin-left: 24rpx;
	}
	.equal-division {
	  padding: 24rpx 0;
	  background-color: #ffffff;
	  overflow: hidden;
	}
	.group_6 {
	  flex: 1 1 150rpx;
	}
	.equal-division-item {
	  padding: 12rpx 0;
	}
	.space-y-4 > view:not(:first-child),
	.space-y-4 > text:not(:first-child),
	.space-y-4 > image:not(:first-child) {
	  margin-top: 8rpx;
	}
	.image_7 {
	  width: 48rpx;
	  height: 48rpx;
	}
	.text_12 {
	  color: #ffbd52;
	}
</style>